import React, { Component } from 'react';
import { createForm } from 'rc-form';
import Head from 'views/component/head/head';
import { Picker, List, InputItem, DatePicker, Toast } from 'antd-mobile';
import { SelectDate, SelectDateComponent } from 'views/component/selectDate/selectDate';
import SelectTitle from 'views/component/selectTitle/selectTitle';
import { SubViewLink } from 'views/component/subViewLink/subViewLink';
import moment from 'moment';
import api from 'js/api/index';
import './add.scss';
import { i18n } from 'js/core/i18n';
const nowTimeStamp = Date.now();
const now = new Date(nowTimeStamp);
class AddActive extends Component {
	constructor() {
		super();
		this.state = {
			dataType: null
		};
	}
	dataTypeOnChange = (dataType) => {
		this.setState({ dataType: dataType })
	}
	submit = () => {
		let data = this.props.form.getFieldsValue();
		if (!data.HolidayName || !this.state.dataType || !data.date) {
			Toast.fail(i18n.get('请输入完整的信息'), 2)
			return
		}
		console.log(data)
		data.DataTypeID = this.state.dataType.DataTypeID;
		data.HolidayStartDate = moment(data.date[0]).format('YYYY-MM-DD');
		data.HolidayEndDate = moment(data.date[1]).format('YYYY-MM-DD');
		data.HolidayYear = moment(data.HolidayYear).year();
		api('/SysBase/HolidayAddEdit', data, 'POST').then((data) => {
			if (data.code === -1) {
				Toast.fail(data.message, 2)
			} else {
				Toast.success(i18n.get('添加成功'));
				if (this.props.modelData && this.props.modelData.complete) {
					this.props.modelData.complete();
					FW.emit('back');
				}
			}
		})
	}
	render() {
		const { getFieldProps, getFieldsValue } = this.props.form;
		let date = getFieldsValue().date;
		let { dataType } = this.state;
		let dateText = i18n.get('选择时间');
		if (date && date.length > 0) {
			dateText = date[0] + '-' + date[1];
		}

		return (
			<div id="add-active">
				<div className="add-content device-container">
					<List>
						<div className="deviceItem device-border flex-vcenter">
							<SelectTitle classStyle="required">{i18n.get('实体名称')}</SelectTitle>
							<SubViewLink moduleName="selectDataTypeId" className="flex-g-1 text-right deviceItemContent" title={i18n.get('选择实体')} modelData={{ onChange: this.dataTypeOnChange }}>
								{dataType ? dataType.Name : <div style={{ color: '#909090' }}>{i18n.get('选择实体')}</div>}
							</SubViewLink>
						</div>
						<InputItem
							{...getFieldProps('HolidayName') }
							clear
							placeholder={i18n.get("请输入活动名称")}
							className="device-border"
						><SelectTitle classStyle="required">{i18n.get("活动名称")}</SelectTitle></InputItem>
						<DatePicker extra={i18n.get("请选择")} locale={ {DatePickerLocale:{year:i18n.get("年"), month:i18n.get("月"), day:i18n.get("日"), hour:i18n.get("时"), minute:i18n.get("分")}}} extra={i18n.get("请选择")} locale={ {DatePickerLocale:{year:i18n.get("年"), month:i18n.get("月"), day:i18n.get("日"), hour:i18n.get("时"), minute:i18n.get("分")}}} okText={i18n.get("确定")} dismissText={i18n.get("取消")}
							mode="year"
							
							format={val => moment(val).year()}
							{...getFieldProps('HolidayYear', { initialValue: new Date() }) }>
							<List.Item arrow="horizontal">
								<SelectTitle classStyle="required">{i18n.get("活动年份")}</SelectTitle>
							</List.Item>
						</DatePicker>
						<SelectDateComponent  className="deviceItem device-border flex-vcenter" {...getFieldProps('date') } >
							<SelectTitle classStyle="required">{i18n.get("活动时间")}</SelectTitle>
							<div className="flex-g-1 text-right deviceItemContent">
								{dateText}
							</div>
						</SelectDateComponent>
						<InputItem
							{...getFieldProps('Remark') }
							clear
							placeholder={i18n.get("请填写备注")}
							className="device-border"
						><SelectTitle >{i18n.get("备注")}</SelectTitle></InputItem>
					</List>
				</div>
				<div className="add-info mb"><b>*</b>{i18n.get('必填项')}</div>
				<div className="device-btn">
					<button type="button" className="btn btn-primary" onClick={this.submit}>{i18n.get("确认新增")}</button>
				</div>
			</div>
		);
	}
}

export default createForm()(AddActive);
